<template>
	<view class="content_list">
		<!-- <waterfallsFlow
			:single="false"
			:list="list"
			imageSrcKey="image"
			@image-click="imageClick"
		> -->
		<!-- slot="slot{{index}}" -->
		<view
			v-for="(item, index) of list"
			:key="index"
			@click="wapperClick(item)">
			<!-- 自定义内容 -->
			<view
				
				class='flex flex-direction flex-wrap align-stretch homePage_fd1_0_c4_c1_c0'
			>

				<view
					class="play_icon"
					v-if="item.data_type == 2"
				>
					<u-image
						width="100%"
						height="100%"
						shape="circle"
						border-radius="8rpx"
						lazy-load
						:src='STATIC_URL+"545.png"'
					/>
				</view>

				<image
					class='homePage_fd1_0_c4_c1_c0_c0'
					mode="aspectFill"
					:src='item.image'
				>
				</image>
				<view class='flex flex-direction flex-wrap align-stretch homePage_fd1_0_c4_c1_c0_c1'>
					<text class='homePage_fd1_0_c4_c1_c0_c1_c0'>{{item.title}}</text>
					<view class='flex flex-wrap align-center'>
						<image
							class='homePage_fd1_0_c4_c1_c0_c1_c1_c0'
							mode="aspectFill"
							:src='item.head_img'
						></image>
						<view class='homePage_fd1_0_c4_c1_c0_c1_c1_c1'>{{item.user_nickname}}</view>
						<image
							v-if="item.is_like"
							class='homePage_fd1_0_c4_c1_c0_c1_c1_c2'
							mode="aspectFill"
							:src='STATIC_URL+"544.png"'
						></image>
						<image
							v-else
							class='homePage_fd1_0_c4_c1_c0_c1_c1_c2'
							mode="aspectFill"
							:src='STATIC_URL+"491.png"'
						></image>
						<view class='homePage_fd1_0_c4_c1_c0_c1_c1_c3'>{{item.like_nums}}</view>
					</view>
				</view>
			</view>
		</view>
		<!-- </waterfallsFlow> -->
	</view>
</template>

<script>
	import waterfallsFlow from "../maramlee-waterfalls-flow/maramlee-waterfalls-flow.vue";
	import { STATIC_URL } from '@/common/config.js'
	export default {
		props: {
			list: {
				type: Array,
				default: function() {
					return []
				}
			}
		},
		data() {
			return {
				STATIC_URL,
			}
		},
		components: {
			waterfallsFlow
		},
		created() {},
		methods: {
			imageClick(index) {
				
				// data_type 1 文章  2视频
				if (global.token) {
					if (this.list[index].data_type == 1) {
						uni.navigateTo({
							url: '/pages/shouye/maTtention/maTtention?id=' + this.list[index].aid
						})
					} else if (this.list[index].data_type == 2) {
						uni.navigateTo({
							url: '/pages/shouye/maTtention/videoDetails?id=' + this.list[index].aid
						})
					}
				} else {
					uni.navigateTo({
						url: '/pages/tabBar/passwordLogin/passwordLogin'
					})
				}
				
			},
			wapperClick(item) {
				console.log(global.token);
				if (global.token) {
					if (item.data_type == 1) {
						uni.navigateTo({
							url: '/pages/shouye/maTtention/maTtention?id=' + item.aid
						})
					} else if (item.data_type == 2) {
						uni.navigateTo({
							url: '/pages/shouye/maTtention/videoDetails?id=' + item.aid
						})
					}
				} else {
					uni.navigateTo({
						url: '/pages/tabBar/passwordLogin/passwordLogin'
					})
				}
			},
		},
	}
</script>

<style
	lang="scss"
	scoped
>
	.content_list {
		display: flex;
		align-items: center;
		justify-content: space-between;
		flex-wrap: wrap;
	}

	.homePage_fd1_0_c4_c1_c0_c1_c1_c3 {
		color: #666666;
		font-size: 24rpx;
		font-weight: 400;
		max-width: 45rpx;
		-webkit-line-clamp: 1;
		overflow: hidden;
		text-overflow: ellipsis;
		display: -webkit-box;
		-webkit-box-orient: vertical;
	}

	.homePage_fd1_0_c4_c1_c0_c1_c1_c2 {
		width: 32rpx;
		height: 32rpx;
		border-radius: 0rpx 0rpx 0rpx 0rpx;
		margin: 0rpx 13rpx 0rpx auto;
	}

	.homePage_fd1_0_c4_c1_c0_c1_c1_c1 {
		color: #666666;
		font-size: 24rpx;
		font-weight: 400;
		margin: 0rpx 0rpx 0rpx 12rpx;
	}

	.homePage_fd1_0_c4_c1_c0_c1_c1_c0 {
		width: 40rpx;
		height: 40rpx;
		border-radius: 20rpx;
	}

	.homePage_fd1_0_c4_c1_c0_c1_c0 {
		color: #333333;
		font-size: 28rpx;
		font-weight: 500;
		padding: 24rpx 0rpx 24rpx 0rpx;
		width: 300rpx;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}

	.homePage_fd1_0_c4_c1_c0_c1 {
		padding: 0rpx 25rpx 20rpx 20rpx;
	}

	.homePage_fd1_0_c4_c1_c0_c0 {
		width: 340rpx;
		height: 450rpx;
		border-radius: 0rpx 0rpx 0rpx 0rpx;
	}

	.homePage_fd1_0_c4_c1_c0 {
		// padding: 0rpx 0rpx 24rpx 0rpx;
		overflow: hidden;
		border-radius: 16rpx;
		position: relative;

		.play_icon {
			position: absolute;
			top: 20rpx;
			right: 20rpx;
			height: 20rpx;
			width: 50rpx;
			height: 50rpx;
			z-index: 1;
		}
	}
</style>